<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>瀑布流布局</title>
    <link rel="stylesheet" href="./css/reset.min.css">
    <link rel="stylesheet" href="./css/index.min.css">
</head>
<body>
    <div class="main clearfix" id="main">
        <div class="box">
            <div class="pic"><img src="./images/0.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/1.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/2.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/3.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/4.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/5.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/6.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/7.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/8.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/9.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/10.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/11.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/12.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/13.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/14.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/15.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/16.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/17.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/18.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/19.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/20.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/21.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/22.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/23.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/24.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/25.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/26.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/27.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/28.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/29.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/25.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/26.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/27.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/28.jpg"></div>
        </div>
        <div class="box">
            <div class="pic"><img src="./images/29.jpg"></div>
        </div>
    </div>
</body>
</html>